<template>
	<view class="cart">
		<view v-if="goodsCartInfo.length">
			<good-cards :goods-info="goodsCartInfo" show-check-box goodsType="numberCart" class="good-cards"
				@reGerGoodsInfo='getGoodsInCart'></good-cards>
			<button class="btn-submit">提交订单</button>
		</view>
		<view v-else class="null-cart">
			<image src="https://hbimg.huabanimg.com/a4064bdab5f6c800ed664014f3eb7d13a4dd25b3138d0-hYHe07_fw658"></image>
		</view>
	</view>
</template>

<script>
	import goodCards from "../goods/goodCards.vue"
	import cartApi from "../../api/shopping-cart/index.js"
	import {
		mapState
	} from 'vuex'
	export default {
		data() {
			return {
				goodsCartInfo: []
			}
		},
		components: {
			goodCards
		},
		computed: {
			...mapState('login', ['isAuth'])
		},
		onShow() {
			this.getGoodsInCart()
		},
		methods: {
			async getGoodsInCart() {
				let res = await cartApi.goodsInCart()
				if (res.code == 200) {
					this.goodsCartInfo = res.list
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.cart {
		.null-cart {
			width: 750rpx;
			height: calc(100vh - 190rpx);
			background-color: #fff;
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.good-cards {
			margin-bottom: 80rpx;
		}

		.btn-submit {
			width: 100vw;
			height: 80rpx;
			line-height: 80rpx;
			background: linear-gradient(to bottom, #6aef2c, #c7fe88);
			color: #fff;
			position: fixed;
			z-index: 999;
			bottom: 90rpx;
		}


	}
</style>